<template>
    <div class="table">
        <div class="crumbs">
            <Breadcrumb>
                <BreadcrumbItem><Icon type="ios-paper" /> 简历列表</BreadcrumbItem>
            </Breadcrumb>
        </div>
        <Card>
            <Select v-model="params.education" clearable filterable placeholder="筛选学历" @change="search" class="handle-select mr10" @on-change="search">
                <Option key="0" label="选择学历" value=""></Option>
                <Option key="1" label="博士" value="博士"></Option>
                <Option key="2" label="硕士" value="硕士"></Option>
                <Option key="3" label="本科" value="本科"></Option>
                <Option key="4" label="博士后" value="博士后"></Option>
            </Select>
            <Input v-model="params.real_name_like" placeholder="搜索姓名" class="handle-input mr10" @keyup.enter.native="search"></Input>
            <Button type="primary" icon="md-search" @click="search">搜索</Button>
            <Button type="warning" icon="md-refresh" @click="reset">重置</Button>
            <Button type="primary" icon="md-add" @click="add" style="float:right;">添加</Button>
        </Card>

        <Card style="margin-top:20px;">
            <Table :columns="columns" :data="tableData" :loading="loading" stripe border highlight-row></Table>
            <Page
                :total="total"
                :current="params.page"
                :page-size="params.size"
                :page-size-opts="[10,15,20,50,100,300]"
                show-elevator
                show-sizer
                show-total
                transfer
                @on-change="handleCurrentChange"
                @on-page-size-change="handleSizeChange"
            />
        </Card>
    </div>
</template>

<script>
    let module = 'resume';
    import expandRow from './resume_expand.vue';
    export default {
        components: {
            expandRow
        },
        data() {
            return {
                url: pub.apiDomain + module,
                cacheKey: module + '_list',
                tableData: [],
                select_tr: [],  //选择tr
                del_list: [],
                columns: [
                    {
                        type: 'expand',
                        width: 50,
                        render: (h, params) => {
                            return h(expandRow, {
                                props: {
                                    row: params.row
                                }
                            });
                        }
                    },
                    {title: 'id', key: 'id', width:120, sortable: true, sortType: 'desc'},
                    {title: '姓名', key: 'real_name', sortable: true},
                    {title: '申请职位', key: 'job', sortable: true},
                    {title: '性别', key: 'gender',sortable: true, render: (h, params) => {
                        return params.row.type == 1 ? '男' : '女';
                    }},
                    {title: '出生', key: 'birthday', sortable: true},
                    {title: '邮箱', key: 'email',width:200,tooltip:true},
                    {title: '手机', key: 'phone'},
                    {title: 'qq/微信', key: 'qqwechat'},
                    {title: '学历', key: 'education', sortable: true},
                    {title: '添加时间', key: 'ts', sortable: true, render: (h,params) => {
                        return pub.formatDateTime(params.row.ts);
                    }},
                    {title: '状态', key: 'st',sortable: true, render: (h, params) => {
                        return <i-switch type="primary" true-value={1} false-value={0} value={params.row.st}  onOn-change={value => {
                            params.row.st = value;
                            pub.stchange(this, module, params.row);
                        }}></i-switch>
                    }},
                    {
                        title: '操作',
                        width: 200,
                        key: 'action',
                        render: (h, params) => {
                            return <span>
                                <i-button type="primary" icon="ios-create-outline" style="margin-right:6px;" onClick={(e)=>{this.handleEdit(params.row)}}>编辑</i-button>
                                <i-button type="error" icon="md-trash" onClick={(e)=>{this.remove(params.row.id)}}>删除</i-button>
                            </span>
                        }
                    }
                ],
                total: 0,
                loading: true,
                params: {   //post参数
                    page: 1,
                    size: pub.pageSize,
                },
            }
        },
        created(){
            //setCache(this.cacheKey, null);
            //还原列表状态
            let params = pub.getCache(this.cacheKey);
            if(params) {
                this.params = params;
            }
            this.getData();
        },
        methods: {
            handleCurrentChange(val){
                this.params.page = val;
                this.getData();
            },
            handleSizeChange(val){
                this.params.size = val;
                this.getData();
            },
            //加载内容：在翻页或搜索后
            getData(){
                this.loading = true;
                this.$axios.post(this.url + '/ls', this.params).then((res) => {
                    this.tableData = res.d.data;
                    this.total = res.d.total;
                    this.loading = false;
                    //保存列表状态
                    pub.setCache(this.cacheKey, this.params);
                });
            },
            //搜索
            search(){
                this.getData();
            },
            reset(){
                this.params = {page:1,size:pub.pageSize};
                this.getData();
            },
            add(){
                this.$router.push('/resume/add');
            },
            //编辑
            handleEdit(row) {
                this.$router.push('/resume/'+row.id);
            },
            //删除
            remove(id) {
                if(!confirm('确定删除吗？')) return false;
                this.$axios.get(this.url + '/del/id/' + id).then(res => {
                    this.$Message.success('删除成功');
                    this.getData();
                });
            },
            //数据过滤器
            gender_formatter(row, column) {
                return row.gender == '1' ? '男' : '女';
            },
            time2str(row) {
                return pub.formatDateTime(row.ts);
            },
        }
    }
</script>

<style scoped>
.handle-box{
    margin-bottom: 20px;
}
.handle-select{
    width: 120px;
}
.handle-input{
    width: 300px;
    display: inline-block;
}
</style>